<template>
  <div class="detail">
    <div class="article-wrapper">
      <h2 class="title">{{detail.title}}</h2>
      <div class="description">
        <div class="origin">文章来源：{{detail.origin}}</div>
        <div class="pub-time">发布时间：{{data}}</div>
      </div>
      <div class="article" v-html="detail.content"></div>
    </div>
  </div>
</template>

<script>
import dayjs from 'dayjs'
export default {
  name: 'ArticleDetail',

  data() {
    return {
      detail: {},
      id: this.$route.query.id
    }
  },

  computed: {
    data(){
      return dayjs(this.detail.createdAt).format('YYYY-MM-DD HH:mm:ss')
    }
  },

  mounted() {
    this.getDetail(this.id)
  },

  methods: {
    async getDetail(id){
      const res = await this.$http(`/users/articleDetail/${id}`)
      this.detail = res.data
    }
  }
}
</script>

<style lang="less" scoped>
@import '../assets/style/articleDetail.less';
</style>